<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" 
      xmlns:ui="http://java.sun.com/jsf/facelets"
	   xmlns:f="http://java.sun.com/jsf/core" 
      xmlns:h="http://java.sun.com/jsf/html" 
      xmlns:a4j="http://richfaces.org/a4j"
	   xmlns:rich="http://richfaces.org/rich" 
      xmlns:composite="http://java.sun.com/jsf/composite">

<!-- INTERFACE -->
<composite:interface>
	<composite:attribute name="casoDeUso" />
	<composite:attribute name="casosDeUso" />
	<composite:attribute name="bean" />
</composite:interface>

<!-- IMPLEMENTATION -->
<composite:implementation>
	<rich:panel id="casoDeUsoPanel" styleClass=".form" header="Registro de casosDeUso" headerClass="header" columnClasses="label, none">

	<h:panelGrid columns="6"  >
		<h:panelGroup><div style="text-align:right; width:70px;"><h:outputLabel value="Nome:" /></div></h:panelGroup>
		<h:inputText id="nomeCasoDeUso" value="#{cc.attrs.casoDeUso.nome}"   style="width:100px;" />
		<rich:message for="nomeCasoDeUso" errorClass="invalid" />
	
		<h:panelGroup><div style="text-align:right; width:70px;"><h:outputLabel value="Versão:" /></div></h:panelGroup>
		<h:inputText id="versaoCasoDeUso" value="#{cc.attrs.casoDeUso.versao}"   style="width:100px;" />
		<rich:message for="versaoCasoDeUso" errorClass="invalid" />

		<h:panelGroup><div style="text-align:right; width:70px;"><h:outputLabel value="Data criação:" /></div></h:panelGroup>
       	<rich:calendar for="dataCriacaoCasoDeUso" value="#{cc.attrs.casoDeUso.dataCriacao}" datePattern="dd/MM/yyyy" mode="ajax" boundaryDatesMode="scroll" >
       		<f:convertDateTime type="date" dateStyle="short" locale="pt_BR" timeZone="America/Sao_Paulo" pattern="dd/MM/yyyy"/>  
   		</rich:calendar>  
		<rich:message for="dataCriacaoCasoDeUso" errorClass="invalid" />

		<h:panelGroup><div style="text-align:right; width:70px;"><h:outputLabel value="Está ativo?" /></div></h:panelGroup>
		<h:selectBooleanCheckbox id="ativoCasoDeUso" value="#{cc.attrs.casoDeUso.ativo}"/>
		<rich:message for="ativoCasoDeUso" errorClass="invalid" />
	</h:panelGrid>
	
	<h:panelGrid columns="3" >
		<h:panelGroup><div style="text-align:right; width:70px;"><h:outputLabel value="Descricao:" /></div></h:panelGroup>
		<h:inputTextarea id="descricaoCasoDeUso" value="#{cc.attrs.casoDeUso.descricao}" rows="8" cols="80" />
		<rich:message for="descricaoCasoDeUso" errorClass="invalid" />
	</h:panelGrid>
	
	<h:panelGrid columns="3" >
		<h:commandButton id="salvaCasoDeUso" action="#{cc.attrs.bean.addCasoDeUso}" render="listaDeCasosDeUso"
			value="Adicionar caso de uso" styleClass="register" title="Clique para adicionar caso de uso"/>
		<h:messages styleClass="messages" errorClass="invalid" infoClass="valid" warnClass="warning" globalOnly="true" />
	</h:panelGrid>	
</rich:panel>
	
	
<rich:collapsiblePanel id="listaDeCasosDeUso" header="Casos de uso" headerClass="header" title="Click to expand/collapse">
   <h:panelGroup rendered="#{empty cc.attrs.casosDeUso}">
      <em>Nenhum caso de uso registrado.</em>
   </h:panelGroup>
   <rich:dataTable var="item" value="#{cc.attrs.casosDeUso}" rendered="#{not empty cc.attrs.casosDeUso}" style="width : 100%">
	   <rich:column>
			<a4j:commandLink action="#{cc.attrs.bean.buscaCasoDeUso}" styleClass="no-decor" render="casoDeUsoPanel" > Visualiza
				<f:setPropertyActionListener target="#{cc.attrs.bean.idCasoDeUso}" value="#{item.id}" />
			</a4j:commandLink>
           </rich:column>
		<rich:column>
			<f:facet name="header">Id</f:facet>  #{item.id}
           </rich:column>
		<rich:column>
			<f:facet name="header">Nome</f:facet>  #{item.nome}
           </rich:column>
		<rich:column>
			<f:facet name="header">Descrição</f:facet> #{item.descricao}
           </rich:column>
		<rich:column>
			<f:facet name="header">Data criação</f:facet> #{item.dataCriacao}
            </rich:column>
	</rich:dataTable>
</rich:collapsiblePanel>	
</composite:implementation>
</html>